﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link rel="stylesheet" href="/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="/css/font-awesome.css" />
    <link rel="stylesheet" href="fonts/fontawesome-webfont.svg" />
    <style>
        body {
            color: #777;
        }

        label {
            color: #777;
            padding-left: 20px;
            padding-top: 40px;
            font-size: 14px;
        }
    </style>
</head>
<body>

    <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="container">
            <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
                <img src="/images/logo-big.ico" />
                <span style="font-size:18px;font-weight:600;color:#777">
                    一起帮
                </span>
                <span style="color:#777">·网络互助平台</span>
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-expanded="false">
                            <span class="fa fa-question-circle"></span>
                            求助
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="Course/New.html">督导班</a>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">疑问发布</a>
                            <a class="dropdown-item" href="#">疑问列表</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">发布</a>
                        </div>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-expanded="false">
                            <span class="fa fa-eye"></span>
                            督促
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="Course/New.html">督导班</a>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">疑问发布</a>
                            <a class="dropdown-item" href="#">疑问列表</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">发布</a>
                        </div>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-expanded="false">
                            <svg t="1650443827100" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4923" width="16" height="16"><path d="M338.823529 259.764706h376.470589a7.529412 7.529412 0 0 0 0-15.058824h-376.470589a7.529412 7.529412 0 0 0 0 15.058824zM338.823529 410.352941h286.117647a7.529412 7.529412 0 0 0 0-15.058823h-286.117647a7.529412 7.529412 0 0 0 0 15.058823zM338.823529 515.764706h210.82353a7.529412 7.529412 0 0 0 0-15.058824h-210.82353a7.529412 7.529412 0 0 0 0 15.058824zM338.823529 621.176471h210.82353a7.529412 7.529412 0 0 0 0-15.058824h-210.82353a7.529412 7.529412 0 0 0 0 15.058824zM255.864471 407.883294a7.619765 7.619765 0 0 0-10.285177-2.816L135.68 467.892706a7.559529 7.559529 0 0 0-2.816 10.285176 7.574588 7.574588 0 0 0 10.285176 2.816l109.914353-62.825411a7.544471 7.544471 0 0 0 2.800942-10.285177zM257.746824 553.953882a7.529412 7.529412 0 0 0-10.270118-2.800941l-48.414118 27.678118a7.529412 7.529412 0 1 0 7.469177 13.071059l48.414117-27.678118a7.499294 7.499294 0 0 0 2.800942-10.270118zM251.181176 673.882353c-1.355294 1.355294-2.258824 3.312941-2.258823 5.406118a7.499294 7.499294 0 0 0 7.529412 7.393882c1.972706 0 3.930353-0.752941 5.285647-2.108235a7.664941 7.664941 0 0 0 0.135529-10.691765c-2.861176-2.861176-8.282353-2.56-10.691765 0zM309.744941 776.282353c-1.505882 1.355294-2.243765 3.312941-2.243765 5.270588 0 2.123294 0.752941 4.080941 2.108236 5.421177 1.520941 1.355294 3.312941 2.108235 5.421176 2.108235 1.957647 0 3.915294-0.752941 5.270588-2.243765a7.303529 7.303529 0 0 0 0-10.556235c-2.710588-2.876235-7.996235-2.876235-10.556235 0z" p-id="4924"></path><path d="M994.439529 371.817412L805.647059 227.222588v-51.425882c0-40.463059-39.619765-81.679059-78.516706-81.679059H331.715765c-40.794353 0-68.186353 41.908706-68.186353 81.061647v43.986824L41.938824 345.840941c-16.850824 9.637647-28.958118 25.298824-34.093177 44.122353s-2.665412 38.475294 6.972235 55.311059L279.341176 908.016941a72.402824 72.402824 0 0 0 44.122353 34.093177 72.176941 72.176941 0 0 0 55.326118-6.972236l134.068706-76.649411 71.333647 54.106353c12.754824 9.682824 28.009412 14.757647 43.821176 14.757647 3.358118 0 6.731294-0.240941 10.134589-0.692706a72.463059 72.463059 0 0 0 48.158117-28.084706l322.108236-424.673883a73.005176 73.005176 0 0 0-13.974589-102.083764zM293.647059 175.179294c0-24.048941 16.278588-50.944 38.068706-50.944h395.414588c22.166588 0 48.399059 27.934118 48.399059 51.561412V700.988235c0 26.413176-27.060706 40.658824-52.510118 40.658824h-61.500235l-0.256-0.451765-0.813177 0.451765H340.886588c-23.521882 0-47.239529-12.574118-47.239529-40.658824V175.179294z m70.189176 733.801412c-9.863529 5.616941-21.383529 7.077647-32.451764 4.065882a42.450824 42.450824 0 0 1-25.901177-19.968L40.975059 430.320941c-5.632-9.863529-7.077647-21.383529-4.065883-32.436706s10.104471-20.269176 19.968-25.901176L278.588235 245.248V700.988235c0 32.813176 25.615059 55.717647 62.298353 55.717647h292.698353l-124.641882 69.857883-0.542118 0.180706-0.180706-0.316236-1.611294 0.918589-0.225882 0.12047-142.546824 81.513412z m298.450824-28.611765a42.465882 42.465882 0 0 1-28.265412 16.459294 42.736941 42.736941 0 0 1-31.653647-8.237176l-73.637647-55.853177 135.649882-76.032h58.624c14.802824 0 29.846588-4.186353 42.089412-11.881411l-102.806588 135.54447z m322.108235-424.673882L789.097412 713.185882c0.933647-3.84 1.490824-7.875765 1.490823-12.197647V253.635765l185.584941 142.140235a42.812235 42.812235 0 0 1 8.222118 59.919059z" p-id="4925"></path><path d="M815.013647 427.128471a7.529412 7.529412 0 0 0-9.080471 12.001882l70.625883 53.579294a7.529412 7.529412 0 1 0 9.08047-11.986823l-70.625882-53.594353zM798.418824 583.213176c-1.355294 1.520941-2.108235 3.328-2.108236 5.285648a7.755294 7.755294 0 0 0 7.529412 7.529411 7.469176 7.469176 0 0 0 7.529412-7.529411c0-1.957647-0.752941-3.764706-2.258824-5.421177-2.710588-2.710588-7.228235-3.011765-10.691764 0.135529z" p-id="4926"></path></svg>
                            文章
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="Course/New.html">督导班</a>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">疑问发布</a>
                            <a class="dropdown-item" href="#">疑问列表</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">发布</a>
                        </div>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-expanded="false">
                            <svg t="1650444306975" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9113" width="16" height="16"><path d="M820.409449 797.228346q0 25.19685-10.07874 46.866142t-27.716535 38.299213-41.322835 26.204724-50.897638 9.574803l-357.795276 0q-27.212598 0-50.897638-9.574803t-41.322835-26.204724-27.716535-38.299213-10.07874-46.866142l0-675.275591q0-25.19685 10.07874-47.370079t27.716535-38.80315 41.322835-26.204724 50.897638-9.574803l357.795276 0q27.212598 0 50.897638 9.574803t41.322835 26.204724 27.716535 38.80315 10.07874 47.370079l0 675.275591zM738.771654 170.330709l-455.559055 0 0 577.511811 455.559055 0 0-577.511811zM510.992126 776.062992q-21.165354 0-36.787402 15.11811t-15.622047 37.291339q0 21.165354 15.622047 36.787402t36.787402 15.622047q22.173228 0 37.291339-15.622047t15.11811-36.787402q0-22.173228-15.11811-37.291339t-37.291339-15.11811zM591.622047 84.661417q0-8.062992-5.03937-12.598425t-11.086614-4.535433l-128 0q-5.03937 0-10.582677 4.535433t-5.543307 12.598425 5.03937 12.598425 11.086614 4.535433l128 0q6.047244 0 11.086614-4.535433t5.03937-12.598425z" p-id="9114" fill="#333333"></path></svg>
                            APP下载
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="Course/New.html">督导班</a>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">疑问发布</a>
                            <a class="dropdown-item" href="#">疑问列表</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">发布</a>
                        </div>
                    </li>
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-expanded="false">
                            <span class="fa fa-user-secret"></span>
                            未登录
                        </a>
                        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                            <a class="dropdown-item" href="Course/New.html">督导班</a>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">疑问发布</a>
                            <a class="dropdown-item" href="#">疑问列表</a>
                            <div class="dropdown-divider"></div>
                            <a class="dropdown-item" href="#">列表</a>
                            <a class="dropdown-item" href="#">发布</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item active" aria-current="page">
                    <small class="fa fa-calendar"></small>
                    <small>
                        <a href="#">小九</a>验收预备班-1-<a href="#">胡明东</a>（2022年04月05日） 留言：ღ( ´･ᴗ･` )笔芯
                    </small>
                </li>
                <li class="ml-auto">
                    <a style="margin-left:auto" href="#"><small>全部消息</small></a>
                </li>
            </ol>
        </nav>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-8">
                <form>
                    <label>
                        <span class="fa fa-eye-slash"> </span>
                        不显示
                    </label>
                    <label>
                        <input type="checkbox" />
                        已酬谢
                    </label>
                    <label>
                        <input type="checkbox" />
                        已撤销
                    </label>
                    <label>
                        <input type="checkbox" />
                        协助中
                    </label>
                    <label>
                        <span class="fa fa-eye"> </span>
                        只显示
                    </label>
                    <label>
                        <input type="checkbox" />
                        我的关注
                    </label>
                    <label>
                        <input type="checkbox" />
                        有总结
                    </label>
                </form>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-8">
                <div class="problem-1">
                    <small>
                        <small class="fa fa-calendar"></small>
                        <span>2022年03月01日 14点08分</span>
                    </small>
                    <a href="#" style="float:right">skyline</a>
                    <span class="fa fa-user-circle-o" style="float:right;"></span>

                    <div style="font-size:24px">
                        <span class="badge badge-secondary">协助中</span>
                        <a href="#" style="color:black">自学完了源栈二期视频,想请教下简历和面试相关事宜</a>
                    </div>
                    <div style="margin-top:10px;margin-bottom:10px">
                        在B站看完了二期视频，目前准备投简历找工作，但对于简历的撰写没有思绪，也想请教一下面试经验之类，麻烦大家不吝赐教。<a href="#">……</a>
                    </div>
                    <div style="margin-top:10px;margin-bottom:10px">
                        <span class="fa fa-tags"></span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">面试</span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">简历</span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">职场</span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">C#</span>
                    </div>
                    <div>
                        <span name="reward">悬赏： 50 </span>
                        <span style="margin-left:10px"> 应答： 0 </span>
                        <span style="margin-left:10px" class="all"> 总结： 1 </span>
                    </div>
                    <br />
                    <div style="border-bottom: 1px solid #ccc;padding-bottom:10px"></div>
                </div>
                <div class="problem-2">
                    <small>
                        <small class="fa fa-calendar"></small>
                        <span>2022年03月01日 14点07分</span>
                    </small>
                    <a href="#" style="float:right">skyline</a>
                    <span class="fa fa-user-circle-o" style="float:right;"></span>

                    <div style="font-size:24px">
                        <span class="badge badge-secondary">已撤销</span>
                        <a href="#" style="color:black">自学完了源栈二期视频,想请教下简历和面试相关事宜</a>
                    </div>
                    <div style="margin-top:10px;margin-bottom:10px">
                        在B站看完了二期视频，目前准备投简历找工作，但对于简历的撰写没有思绪，也想请教一下面试经验之类，麻烦大家不吝赐教。<a href="#">……</a>
                    </div>
                    <div style="margin-top:10px;margin-bottom:10px">
                        <span class="fa fa-tags"></span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">面试</span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">简历</span>
                        <span class="badge badge-secondary;kwd" style="margin-left:10px">职场</span>
                        <span c class="badge badge-secondary;kwd" style="margin-left:10px">C#</span>
                    </div>
                    <div>
                        <span name="reward">悬赏： 50 </span>
                        <span style="margin-left:10px"> 应答： 0 </span>
                        <span style="margin-left:10px" class="all"> 总结： 0 </span>
                    </div>
                    <br />
                    <div style="border-bottom: 1px solid #ccc;padding-bottom:10px"></div>
                </div>
            </div>
        </div>
    </div>
    <script>
        //统计有多少个悬赏大于1的求助
        var reward = document.getElementsByName('reward')
        var num = 1
        for (var i = 0; i < reward.length; i++) {
            if ((reward[i].innerText[4] + reward[i].innerText[5]) > 1) {
                console.log(num);
                num++
            }
        }
        //将状态为“协助中”的求助背景改成灰黑色
        var state = document.getElementsByClassName('badge badge-secondary')
        for (var i = 0; i < state.length; i++) {
            if (state[i].innerText == "协助中") {
                state[i].style = "background-color:darkgray"
            }
        }
        //如果总结数为0，将其从DOM树中删除
        var all = document.getElementsByClassName('all')
        for (var i = 0; i < all.length; i++) {
            if (all[i].innerText[4] == 0) {
                all[i].remove()
            }
        }
        //写一个函数getKeywordsCount() ，可以统计某个求助使用了多少关键字
        function getKeywordsCount(position) {
            return position[0].getElementsByClassName('badge badge-secondary;kwd')
        }
        console.log(getKeywordsCount(document.getElementsByClassName('problem-1')));
        //参考用户注册页面，显示错误提示：
        //密码的长度不能小于4
        //密码和确认密码必须一致


        
    </script>
</body>
</html>